<template>
	<!-- 接口是一次性查询全部没有分页 可以做分页查询 - 作为模版 -->
	<view class="requiregoods">
		<view class="pup-title">上传图片</view>
		<view class="" style="margin-top: 24rpx;">
			<up-upload :fileList="fileListImg" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="8" :previewFullImage="true">
				<image style="width: 160rpx;height: 160rpx" src="https://oss.jtmckj.com/drifbottle/positive.png"  mode="widthFix"></image>
			</up-upload>
		</view> 
		<view @tap="$u.throttle(toTaskPreImgSave, 500)"  style="width: 480rpx;height: 80rpx;border-radius: 40rpx;border: 1rpx solid #FF6A00;text-align: center;line-height: 80rpx;position: fixed;bottom: 40rpx;margin: 0 135rpx;color: #FF6A00;">
			确认上传
		</view>
	</view>
</template>


<script setup>   
    import setting from "@/common/config.js"; 
	import { onLoad, onReachBottom, onPullDownRefresh, onShow, onHide, onPageScroll } from '@dcloudio/uni-app'; 
	import { ref, reactive, nextTick, defineExpose ,watch } from 'vue';  
 
	const fileListImg = ref([])
	
	onLoad(() => { 
	 
	});
	
	onShow(() => {
		
	});
	
	onReachBottom(() => {  
		console.log('onReachBottom...') 
	}); 
	
	// 删除图片
	const deletePic = (event) => {
		fileListImg.value.splice(event.index, 1);
	};
	
	// 新增图片
	const afterRead = async (event) => {  
		let lists = [].concat(event.file);
		let fileListLen = fileListImg.value.length; 
		lists.map((item) => {
			fileListImg.value.push({
				...item,
				status: 'uploading',
				message: '上传中',
			});
		}); 
		for (let i = 0; i < lists.length; i++) { 
			const result = await uploadFilePromise(lists[i].url);
			console.log('result:',JSON.parse(result));
			let item = fileListImg.value[fileListLen];  
			fileListImg.value.splice(fileListLen, 1, {
				...item,
				status: 'success',
				message: '',
				url: JSON.parse(result).response
			});
			fileListLen++;
		}
		console.log('result后-fileListImg：',fileListImg.value)
	};
	
	const uploadFilePromise = (url) => { 
		const fileName = url.replace("wxfile://", "");
		const path = setting.PRO_URL
		return new Promise((resolve, reject) => {
			let a = uni.uploadFile({
				url: path + '/api/upload', 
				filePath: url,
				name: 'data', 
				header: {
					'Authorization':'Bearer ' + uni.getStorageSync("token"),
					'content-type': 'multipart/form-data' // 设置请求头内容类型  
				},
				formData: {
					requestId: Math.random().toString(36).substr(2, 8),
					total: 1, 
					index:1,//图片排序
					fileName: fileName,
					objName: 'Mini', // 建议新起一个Mini/h5
					orgCode: '004', // uni.getStorageInfoSync('shopInfo').orgCode,
					uploadType: 'OSS',
					bucketName: 'jtmc'
				},
				success: (res) => {
					resolve(res.data); 
				},
				fail: error => { 
					uni.showToast({ title: '图片上传失败...', icon: 'error', duration: 2000 });
					fileListImg.value = []
					console.log('error:',error)
				    reject() 
				}
				
			});
		});
	};
	
	onPageScroll(e => {
		// if (e.scrollTop < 20) {
		// 	bgColor.value = '#fbc171'
		// } else {
		// 	bgColor.value = '#fbc171'
		// }
	})  

 
	// 确认保存
	const toTaskPreImgSave = async() => {  
		// const doesNotContainWx = fileListImg.value.every(item => !item.url.includes("wxfile://")); 
		// if (doesNotContainWx) {
		//   console.log("你好-- 不包含了~ wxfile~  nice ok ");
		//   const doesNotContainBlod = fileListImg.value.every(item => !item.url.includes("blob")); 
		//   if(doesNotContainBlod){
		// 	  console.log("你好-- 不包含了 ~ blod ~  nice ok ");
		// 	  toTask(toolItem.value) 
		//   }else{
		// 	  console.log("包含le blod ~~ ",fileListImg.value);
		// 	  uni.showToast({ title: '图片上传失败，请删除重新上传', icon: 'error', duration: 2000 });
		//   } 
		// } else {
		//   console.log("包含le wxfile ~~ ");
		//   uni.showToast({ title: '图片处理中请稍等', icon: 'error', duration: 2000 });
		// }   
	}
	
	// 打开上传凭证的弹窗 - 前的校验 - 业务（不允许多家  不允许不选择 允许数量为0）
	const toTaskPreImg = (itemModal) => { 
		// console.log('carLists.value：',carLists.value) 
		// if(carLists.value.length <= 0){
		// 	return
		// }
		// let flagCount = 0;
		// let flag = false;
		// let checkModal = {}; 
		// carLists.value.forEach((bidItem)=>{
		// 	bidItem.taskSuppliers.forEach((item) => {
		// 	  const hasCheckedSubitem = item.taskItems.some(subitem => subitem.checkFlag); 
		// 	  if (hasCheckedSubitem) {
		// 	    flagCount++;
		// 	    checkModal = { ...item }; // 复制满足条件的 taskSuppliers 对象
		// 	  } 
		// 	  if (flagCount >= 2) {
		// 	    flag = true;
		// 	    console.log('超出了2个供应商');
		// 	    return; // 退出外层循环
		// 	  }
		// 	}); 
		// })
		
		// if (flag) {
		//   console.log('最终结果：超出了2个数组');
		//   uni.showToast({ title: '同一个供应商的物料才可同批次勾选收货', icon: 'none', duration: 3000 });
		//   return
		// } 
		// console.log(checkModal); // 输出 checkModal 对象  
		// console.log('checkModal：',checkModal)
		// let modelList = []
		// checkModal?.taskItems?.forEach((item)=>{
		// 	if(item.checkFlag){
		// 		modelList.push(item)
		// 	} 
		// }) 
		// if(modelList.length <= 0){  
		// 	uni.showToast({ title: '请选中当前物料', icon: 'error', duration: 2000 });
		// 	return
		// }  
		// toolItem.value = checkModal
		// show.value = true 
	}
	 
	
	
</script>

<style lang="less" scoped>   

</style>